<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Document</title>

	<link rel="stylesheet" href="css/wbc5.css">

	<style>
		/* div {
			width: 200px;
			height: 100px;
			display: inline;
		} */

		/*span {
			display: block;
			width: 200px;
			height: 150px;
		}*/

		.btn {
			width: 120px;
			height: 35px;
			line-height: 35px;
			border: 1px solid red;
			text-align: center;
			color: red;
			font-size: 16px;
			font-family: 'microsoft yahei';
			border-radius: 3px;
			cursor: pointer;
			background-color: #fff;
			display: inline-block;
			text-decoration: none;
		}

		.btn:hover {
			background-color: red;
			color: #fff;
		}

		.menu {
			/*overflow: hidden;*/
		}

		.menu li {
			float: left;
			/*display: inline-block;*/
			background-color: red;
		}

		.clear {
			clear: both;
		}

		.center {
			width: 200px;
			height: 100px;
			border: 1px solid red;
			line-height: 100px;
			text-align: center;

			position: absolute;
			top: 50%;
			left: 50%;
			margin-left: -100px;
			margin-top: -50px; 
		}

		.outer {
			width: 300px;
			height: 200px;
			border: 2px solid blue;
			position: relative;
		}

		.hide {
			width: 200px;
			height: 100px;
			border: 1px solid red;
			/*display: none;*/
			visibility: hidden;
		}

		.test-cur {
			width: 300px;
			height: 200px;
			background-color: red;
			cursor: pointer;
		}

		/*
			选择权		权重
			#			100
			.			10
			E 	 		1
		*/

		/* #myDiv {
			background-color: green;
		} */
		
		/*#myDiv.my-div {
			background-color: yellow;
		}
		
		div.my-div {
			background-color: pink;
		}
		
		.my-div {
			background-color: blue;
		}*/
		
		div {
			background-color: red!important;
			/*background-color: red!important;*/
		} 



	</style>


</head>
<body>

	<div id="myDiv" class="my-div">my div</div>
	<!-- <div id="myDiv" class="my-div" style="background-color: blue;">my div</div> -->

	<!-- <select name="" id="">
		<option value="">每页显示10条</option>
		<option value="">每页显示20条</option>
		<option value="" selected>每页显示30条</option>
	</select> -->

	 <!-- <label><input type="checkbox">自动登录2</label> -->
	<!-- <input id="abc" type="checkbox"> <label for="abc">自动登录</label> -->

	<!-- <button>my btn</button>
	
	<input type="button" value="my btn2">
	
	<input type="submit" value="save">
	
	<input type="reset"> -->

	<!-- <div class="test-cur">test cur</div>

	<hr>

	<div class="hide">my div</div>
	<button>my btn</button>

	<hr>

	<div class="outer">

		<div class="center">
			测试一下
		</div>

	</div>

	<hr>

	<ul class="menu">
		<li>item1</li>
		<li>item2</li>
		<li>item3</li>
		<li>item4</li>
		<li>item5</li>
		<div class="clear"></div>
	</ul>

	<hr>

	<div class="btn">my btn</div>
	<br>
	<br>
	<button class="btn">my btn2</button>

	<br>
	<br>
	<a href="http://www.baidu.com" class="btn">my btn3</a>

	<hr>

	<div>my div</div>
	<div>my div2</div>

	<hr>

	<span>my span</span>
	<span>my span2</span> -->
	
</body>
</html>